var temp = "";
var imageNum = 0;
var totalImageNum = 0;
var getImageList = function() {	
	$.ajax({
		type: "get",
		dataType: "xml",
		url: "./xml/rollingImage.xml",		
		success: function(data) {
			$(data).find("image").each(function() {				
				var indexNo = $(this).attr("indexNo");
				var imgUrl = $(this).text();			
				makeTemplate(indexNo,imgUrl);
			});
			
			insertTemplateToLayer();			
			//imageLocation();
			imageRolling();
		}
	});		
}
var makeTemplate = function(indexNo,imgUrl) {
	temp += $("#template").html().replace(/{indexNo}/,indexNo).replace(/{imgUrl}/,imgUrl).replace(/{usemapName}/,"#usemapName"+indexNo);	
}
var insertTemplateToLayer = function() {	
	$("#rollingImageWrap").html(temp);
}
var imageLocation = function() {
    var w = $(window).width();
    var moveX = parseInt((1920-w)/2);
    $("#rollingImageWrap .rollingImage").css({
        'left': (-1*moveX)+"px"
    });
}
var imageRolling = function() {	
	totalImageNum = $(".rollingImage").length;
	fadein();
}
var fadein = function() {
	if(imageNum < totalImageNum) imageNum = imageNum + 1;
	else imageNum = 1;
	$(".rollingImage:nth-child("+imageNum+")").fadeIn("slow");    
    setTimeout(fadeout,5000);
}
var fadeout = function() {			
	$(".rollingImage:nth-child("+imageNum+")").fadeOut("slow");												
	fadein();
}		
window.onresize = function() {
	//imageLocation();		
}